<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1"> 
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
	<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
	<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
    </head>
   <body> 

<!-- Start of first page -->
<div data-role="page" id="foo">

	<div data-role="header">
		<h1>Cool Robots</h1>
	</div><!-- /header -->

	<div data-role="content">	
            <ul data-role="listview">
                <li data-role="collapsible-set"><h3>destroy all humans</h3><p>foo bar</p>
                    <ul data-role="listview">
                        <li><a href="#">Bender</a></li>
                        <li><a href="#">Optimus Prime</a></li>
                        <li><a href="#">Soundwave</a></li>
                        <li><a href="#">Wall-E</a></li>
                        <li><a href="#">Maximillian</a></li>
                    </ul>
                </li>
                <li data-role="collapsible-set" >workerbots
                    <ul data-role="listview">
                        <li><a href="#">R2-D2</a></li>
                        <li><a href="#">GORT</a></li>
                        <li><a href="#">Cat Quadcopter</a></li>
                        <li><a href="#">Robocop</a></li>
                        <li><a href="#">The Maschinenmensch</a></li>
                    </ul>
                </li>
            </ul>
	</div><!-- /content -->

	<div data-role="footer">
		<h4>End Robots</h4>
	</div><!-- /footer -->
</div><!-- /page -->


</body>
</html>
